import { AnnounceManageAPI } from '../common/type';
import { Button, Card, Col, Drawer, Row } from 'antd';
import { AnnounceDetailContext } from '../common/UpdateContext';
import { useContext, useState } from 'react';
import { DetailRightViewTop } from './DetailRightViewTop';
import pageStyles from '@/common/pageLayout.less';
import { DetailCheckListView } from './DetailCheckListView';
import { DetailCheckDrawer } from './DetailCheckDrawer';
import { getTenantID, getUserID } from '@/utils';
import cls from 'classnames';

export const DetailRightView: React.FC<AnnounceManageAPI.IDetailRightView> = () => {
  const { prefixCls, announceInfo, curRes } = useContext(AnnounceDetailContext);

  const [checkFormShow, setCheckFormShow] = useState<boolean>(false);

  return (
    <div className={prefixCls + 'rightBoxView'}>
      <DetailRightViewTop />
      <div className={prefixCls + 'rightBoxView-bodyBox'}>
        <div className={prefixCls + 'row-col-divBox'}>
          <Card
            title="审核记录"
            className={cls(pageStyles['page-view'], prefixCls + 'cardHead')}
            bodyStyle={{
              height: '90%',
              padding: '5px 0px',
              overflow: 'hidden',
              position: 'relative',
            }}
          >
            <Row className={'cardBodyRow'}>
              <Col span={24} className={'cardBodyCol'}>
                <DetailCheckListView />

                {announceInfo?.checkerID == getUserID() &&
                  announceInfo?.state == `${getTenantID()}12021001` &&
                  curRes?.['/announceController/checkIssue'] && (
                    <div className={'cardBodybtn'}>
                      <Button
                        type={'primary'}
                        onClick={() => {
                          setCheckFormShow(true);
                        }}
                      >
                        办理
                      </Button>
                    </div>
                  )}
              </Col>
            </Row>

            <DetailCheckDrawer
              visible={checkFormShow}
              onClose={() => {
                setCheckFormShow(false);
              }}
            />
          </Card>
        </div>
      </div>
    </div>
  );
};
